<!--关键字和分类组件-->
<template>
  <el-row>
    <el-col :span="12">
      <el-form-item label="所属分类" >
        <el-cascader
          :props="props"
          @change="getCheckedNodes"
          ref="cascader"
          filterable
          clearable
          :show-all-levels="false"
          :collapse-tags="true"
          v-model="formObject.typeIdList"
        ></el-cascader>
      </el-form-item>
    </el-col>
    <el-col :span="12">
      <el-form-item label="关键字" prop="keyword" >
        <el-select
            v-model="formObject.keywordList"
            multiple
            filterable
            remote
            reserve-keyword
            placeholder="请输入关键词进行选择"
            :remote-method="keywordRemoteMethod"
            :loading="keywordLoading"
        >
          <el-option
              v-for="(item,index) in keywordOptions"
              :key="index"
              :label="item"
              :value="item"
          >
          </el-option>
        </el-select>
      </el-form-item>
    </el-col>
  </el-row>
</template>
<script>
import { databaseAll } from '@/api/qysj/app/rawData/Database'
import { keywordList, listAllFieldType, listFieldType } from '@/api/qysj/app/FieldType'

let id = 0;
export default {
  name: 'FieldAndKeyword',
  props: {
    // typeList: Array,//分类列表数组
    // keywordList: Array,//关键词列表数组
    formObject: Object,//绑定的表单对象
  },
  data() {
    return {
      props: {
        lazy: true,
        multiple: true ,
        clearable:true,
        emitPath:false,
        lazyLoad(node, resolve) {
          console.log('node', node)
          console.log('(node.value===10001||node.value===10000)', (node.value===10001||node.value===10000))
          listFieldType({
            keyword: null,
            parentId:(node.value===10001||node.value===10000)?0:node.value,
            systemCatalogId:null,
            catalogTypes:'0,1,2'
          }).then(res=>{
            if (res.code===200){
              const nodes=res.rows.map(item=>{
                return {
                      value: item.id,
                      label:item.fieldName,
                      leaf: !item.exitSon
                }
              });
              resolve(nodes)
            }
          })
        }
      },
      // 关键词加载控制
      keywordLoading:false,
      // 关键词列表
      keywordOptions:[]
    }
  },
  methods:{
    // 关键词远程搜索方法
    keywordRemoteMethod(query) {
      if (query !== '') {
        this.keywordLoading = true
        keywordList({ keyword: query }).then(res => {
          if (res.code === 200) {
            this.keywordLoading = false
            this.keywordOptions = res.data
            console.log(' this.keywordOptions',  this.keywordOptions)
          } else {
            this.keywordOptions = []
            this.$message(res.msg)
          }
        })
      } else {
        this.keywordOptions = []
      }
    },
    getCheckedNodes(){
      // let nodesInfo = this.$refs['cascader'].getCheckedNodes(true).map(item=>item.value);
      // console.log('nodesInfo', nodesInfo)
      // this.formObject.typeIdList=nodesInfo
      // this.$emit('update-typeList',nodesInfo)
    }
  }
}
</script>
<style scoped lang="scss">

</style>
